<template>
  <view class="application_details">
    <view class="application_box">
      <view class="application_item" v-for="item in titleArr" :key="item">
        <text class="title">{{ item }} ：</text
        >{{
          item == "申请状态"
            ? detailsData[titleData[item]]  == "0"
              ? "未办理"
              : detailsData[titleData[item]] == "1"
              ? "办理中"
              : "已办理"
            : item == "付款周期"? detailsData[titleData[item]]+"个月" : detailsData[titleData[item]]
        }}
      </view>
    </view>
  </view>
</template>

<script setup>
import { onLoad } from "@dcloudio/uni-app";
import { ref } from "vue";

const detailsData = ref({});
const titleArr = ref([
  "房号",
  "申请单号",
  "付款周期",
  "申请时间",
  "申请状态",
  "开始办理时间",
  "办理完成时间",
]);
const titleData = ref({
  房号: "accountNumber",
  申请单号: "applyId",
  付款周期: "payWay",
  申请时间: "applyTime",
  申请状态: "status",
  开始办理时间: "startHandleTime",
  办理完成时间: "endHandleTime",
});
onLoad((option) => {
  let options = JSON.parse(option.information);
  detailsData.value = options;
});
</script>

<style lang="less" scoped>
.application_details {
  display: flex;
  flex-flow: column wrap;
  align-items: center;
  .application_box {
    width: 80vw;
    padding: 30rpx;
    background: @color-origin-white;
    border-radius: 30rpx;
    margin: 20rpx 0;
    .application_item {
      height: 80rpx;
      line-height: 80rpx;
    }
  }
}
</style>